let params = {
  pagenum: 1,
  pagesize: 2,
};

//-------------表单验证-----------------
let form = layui.form;
form.verify({
  len: [/^\S{6,12}$/, "请输入6-12位的密码"],
  same: function (val) {
    if (val !== $("#repwd").val()) return "两次输入密码不一致";
  },
});

//--------------------------页码部分---------------------------
function renderpage(total) {
  let laypage = layui.laypage;
  laypage.render({
    count: total, //数据总数，从服务端得到
    elem: "page", //注意，这里的 test1 是 ID，不用加 # 号
    limits: [1, 10, 30, 40, 100],
    limit: params.pagesize,
    layout: ["prev", "page", "next", "skip", "limit"],
    curr: params.pagenum,
    jump: function (obj, first) {
      //obj包含了当前分页的所有参数，比如：
      //console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
      // console.log(obj.limit); //得到每页显示的条数
      //首次不执行
      if (!first) {
        params.pagenum = obj.curr;
        params.pagesize = obj.limit;
        //do something
        renderlist();
      }
    },
  });
}
//---------------------------获取数据库数据-------------------------
function renderlist() {
  $.get("/admin/users", params, (res) => {
    if (res.status === 0) {
      renderpage(res.total);
      let str = "";
      res.data.forEach((item) => {
        str += ` <tr>
              <td>${item.id}</td>
              <td>${item.username}</td>
              <td>${item.nickname}</td>
              <td>${item.email}</td>
              <td>
                <button type="button"  data-id=${item.id} class="edit layui-btn layui-btn-xs">
                  编辑
                </button>
                <button
                  type="button" data-id=${item.id}
                  class="delete layui-btn layui-btn-xs layui-btn-danger">
                  删除
                </button>
                <button
                  type="button" data-id=${item.id}
                  class=" repwd layui-btn layui-btn-xs layui-btn-normal">
                  重置密码
                </button>
              </td>`;
      });
      $("tbody").html(str);
    }
  });
}
renderlist();

//-------------------删除功能----------------
$("tbody").on("click", ".delete", function () {
  let id = $(this).data("id");
  layer.confirm("确定删除吗?", function (index) {
    $.ajax({
      type: "delete",
      url: `/admin/users/${id}`,
      success: (res) => {
        layer.msg(res.message);
        renderlist();
        // console.log(res);
        // renderpage(res.total);
      },
    });

    layer.close(index);
  });
});

//-------------------编辑功能 (探出层)----------------------
let open;
$("tbody").on("click", ".edit", function () {
  console.log($(this).data("id"));
  open = layer.open({
    type: 1,
    area: ["500px", "300px"],
    content: $("#inp_edit").html(),
  });
  //-----------数据回填
  $.ajax({
    url: `/admin/users/${$(this).data("id")}`,
    success: function (res) {
      if (res.status === 0) {
        // console.log(res);
        // let { email, nickname, username } = res.data;
        form.val("edit", res.data);
      }
    },
  });
});

//修改用户信息请求
$("body").on("submit", "#editform", function (e) {
  e.preventDefault();
  let str = $(this).serialize();
  $.ajax({
    type: "put",
    url: `/admin/users`,
    data: str,
    success: function (res) {
      if (res.status === 0) {
        layer.msg(res.message);
        layer.close(open);
        renderlist();
      }
      console.log(res);
    },
  });
});

//----------------重置密码弹出层------------------
let rpwdid = "";
$("tbody").on("click", ".repwd", function () {
  rpwdid = $(this).data("id");
  //   console.log($(this).data("id"));
  open = layer.open({
    type: 1,
    area: ["500px", "250px"],
    content: $("#inp_repwd").html(),
  });
});

//---------------------修改密码发送请求'--------------
$("body").on("submit", "#repwdform", function (e) {
  e.preventDefault();
  console.log(rpwdid, $("#repwd").val());
  $.ajax({
    type: `PUT`,
    url: `/admin/users/${rpwdid}`,
    data: {
      password: $("#repwd").val(),
    },
    success: function (res) {
      if (res.status === 0) {
        layer.msg(res.message);
        layer.close(open);
      }
    },
  });
});
